

<script type="text/javascript">
    //树表格
    $(function () {
        $('#list').datagrid({
            url          : '<?=site_url("admin/admin/getGroupList");?>?d=d',
            idField      : 'id',
            fitColumns   : true,
            collapseAll  : true,
            singleSelect : true,
            fit          : true,
            doSize       : true,
            closable     : true,
            striped      : true,
            rownumbers   : true,
            toolbar      : $("#toolbal"),
            onDblClickRow: function () {
                showDialog("修改");
            },
            checkbox     : true,
            frozenColumns: [[
                {field: 'id', title: 'ID'},
            ]],
            columns      : [[
                {
                    fiele: 'info',
                    title: '管理员组基本信息',
                    colspan: 5,
                    align: 'center'
                },
                {
                    field    : 'option',
                    title    : '操作',
                    rowspan  : 2,
                    align    : 'center',
                    width    : 80,
                    formatter: function (value, row, index) {
                        if(row.id==1)
                        {
                            return "<span onclick='edit(" + row.id + ")' >编辑</span>";
                        }else{
                            return "<span onclick='accessAcl(" + row.id + ")'>访问授权</span> | <span onclick='edit(" + row.id + ")' >编辑</span> | <span onclick='del(" + row.id + ")'>删除</span>";
                        }

                    }
                }
            ], [
                {field: 'title', title: '组名'},
                {field: 'module', title: '模块'},
                {field: 'description', title: '描述'},
                {
                    field: 'status',
                    title: '状态',
                    formatter: function (value, row, index) {
                        if (value == 1)return "<span style='color:darkgreen;'>可用</span>";
                        else return "<span style='color:red;'>禁用</span>";
                    }
                },
                {field: 'rules', title: '可访问节点',width:200}

            ]]
        });


    })

    //对话框
    function showDialog(option) {
        $("#form").dialog({
            title  : option + '数据',
            closed : false,
            cache  : false,
            modal  : true,
            buttons: [{
                text   : '保存',
                iconCls: 'icon-ok',
                handler: function () {
                    saveData();
                }
            }, {
                text   : '关闭',
                iconCls: 'icon-cancel',
                handler: function () {
                    $("#form").dialog('close');
                }
            }]
        });
        var node = $('#list').datagrid('getSelected');
        $("#form").form("clear");
        if (option == "修改") {
            $('#form').form('load', node);
        }
    }
    //删除
    function del(obj) {
        $("#list").datagrid('selectRow', obj);
        var node = $('#list').datagrid('getSelected');
        $.messager.confirm("删除[" + node.title + "]节点", "你确定删除[" + node.title + "]节点及其了节点?", function (r) {
            if (!r) return;
            //ajax后台发送删除数据
            var nodes = $("#list").datagrid('getChildren', node.id);
            var ids = [];
            for (var i in nodes) {
                ids[i] = nodes[i].id;
            }
            ids.unshift(node.id);
            $.post(
                "<?=site_url('admin/navigate/delete');?>",
                {ids: ids.toString()},
                function (data) {
                    alert(data);
                    $("#list").datagrid('reload');
                },
                'json'
            );
        });
    }
    //保存
    function saveData() {
        return false;
        $("#form").form('submit', {
            url     : "<?=site_url('admin/admin/saveAccess');?>",
            onSubmit: function () {
                var isValid = $(this).form('validate');
                if (!isValid) {
                    $.messager.show({msg: '验证不成功'});
                }
                return isValid;
            },
            success : function (data) {
                data = eval("(" + data + ")");
                if (data.isok) {
                    $.messager.show({msg:'操作成功!', style:{}});
                    $("#list").datagrid("reload");
                } else {
                    $.messager.show({msg:data.error, style:{}});
                }
                $("#form").dialog("close");
            }
        })
    }

    function edit(obj) {
        $("#list").datagrid('selectRecord', obj);
        showDialog("修改");
    }

    function accessAcl(obj) {
        $("#list").datagrid('selectRecord', obj);
        var nodes = $('#list').datagrid('getSelected');

        $("#tree").dialog({
            title    : '['+nodes.title+']组访问制授权',
            resizable: true,
            doSize   : true,
            fit      : true,
            buttons  : [{
                text   : '保存',
                iconCls: 'icon-ok',
                handler: function () {
                    saveAccessAcl(obj);
                    $("#tree").dialog('close');
                }
            }, {
                text   : '关闭',
                iconCls: 'icon-cancel',
                handler: function () {
                    $("#tree").dialog('close');
                }
            }]
        }).tree({
            url       : '<?=site_url("admin/admin/getRuleList");?>?d=d',
            checkbox  : true,
            lines     : true,
            cascadeCheck:false,
            animate   : true,
            onCheck: function (node, checked) {
                if (checked) {
                    var parentNode = $("#tree").tree('getParent', node.target);
                    if (parentNode != null) {
                        $("#tree").tree('check', parentNode.target);
                    }
                } else {
                    var childNode = $("#tree").tree('getChildren', node.target);
                    if (childNode.length > 0) {
                        for (var i = 0; i < childNode.length; i++) {
                            $("#tree").tree('uncheck', childNode[i].target);
                        }
                    }
                }
            },
            loadFilter: function (rows) {
                return rows.rows;
                //return convert(rows, obj);
            },
            formatter : function (node) {
                var arr=nodes.rules.split(",");
                for(var i=0;i<arr.length;i++)
                {
                    if(node.id==arr[i])
                    {
                        node.checked=true;
                    }
                }
                var s = node.text;
                if (node.children) {
                    s += '&nbsp;<span style=\'color:blue\'>(' + node.children.length + ')</span>';
                }
                s+=node.id;
                return s;
             }

        })
    }
    function saveAccessAcl(obj) {

        var nodes = $('#tree').tree('getChecked');
        var nodes_ids = [];
        for (var i = 0; i < nodes.length; i++) {
            nodes_ids[i] = nodes[i].id;
        }

        $.post(
            '<?=site_url("admin/admin/saveAccess");?>',
            {id:obj,rules:nodes_ids.toString()},
            function(data)
            {
                if(!data.isok)
                {
                    $.messager.show({msg:data.error, style:{}});
                }else{
                    $.messager.show({msg:"操作成功", style:{}});
                }
                $("#list").datagrid('reload');
            },
            'json'
        );
    }
    function convert(rows, obj) {
        function exists(rows, pid) {
            for (var i = 0; i < rows.length; i++) {
                if (rows[i].id == pid) return true;
            }
            return false;
        }

        var nodes = [];
        for (var i = 0; i < rows.length; i++) {
            var row = rows[i];
            if (!exists(rows, row.pid)) {

                nodes.push({
                    id     : row.id,
                    text   : row.title,
                    //checked: row.checked
                });
            }
        }

        var toDo = [];
        for (var i = 0; i < nodes.length; i++) {
            toDo.push(nodes[i]);
        }
        while (toDo.length) {
            var node = toDo.shift();    // the parent node
            for (var i = 0; i < rows.length; i++) {
                var row = rows[i];
                if (row.pid == node.id) {
                    var child = {id: row.id, text: row.title};
                    if (node.children) {
                        node.children.push(child);
                    } else {
                        node.children = [child];
                    }
                    toDo.push(child);
                }
            }
        }
        return nodes;
    }
</script>
<div id="toolbal" style="padding: 5px;">
    <span onclick="showDialog('添加')" class="easyui-linkbutton" data-options="iconCls:'icon-add'">添加</span>
    <span onclick="window.location.reload();" class="easyui-linkbutton" data-options="iconCls:'icon-reload'">刷新</span>
    <!-- <form style="padding:5px;">

         时间: <input class="easyui-datebox j_datebox" name="starttime" value="">
         文章: <input class="easyui-validatebox textbox" type="text" name="orderinfo_goodssn" value="">
         类型: <input class="easyui-validatebox textbox" type="text" name="orderinfo_orderinfosn" value="">
         <a id="j_finish_so" href="#" class="easyui-linkbutton" iconCls="icon-search">条件搜索</a>
         <a id="j_finish_clear" href="#" class="easyui-linkbutton" iconCls="icon-search">清空条件</a>
     </form>-->
</div>
<ul id="list" class="easyui-tree" data-options="method:'get',animate:true,checkbox:true"></ul>

<div id="authgroup_mm" class="easyui-menu" style="width:120px;height:auto;overflow: hidden;">
    <div onclick="showEdit('添加')" data-options="iconCls:'icon-add'">添加子菜单</div>
    <div onclick="showEdit('修改')" data-options="iconCls:'icon-edit'">编辑菜单</div>
    <div onclick="removeNode()" data-options="iconCls:'icon-remove'">删除菜单</div>
</div>

<form id="form" closed="true">
    <input name="id" type="hidden">
    <table>
        <tr>
            <td align="right">标　　题：</td>
            <td><input class="easyui-textbox" name="title" required="true"/></td>
        </tr>
        <tr>
            <td align="right">模　　块：</td>
            <td><input name="module" class="easyui-textbox"/></td>
            <td></td>
        </tr>
        <tr>
            <td align="right">描　　述：</td>
            <td><input name="description" class="easyui-textbox"/></td>
            <td></td>
        </tr>
        <tr>
            <td align="right">状　　态：</td>
            <td>
                <select name="status" class="easyui-combobox" required="true">
                    <option value="0">禁用</option>
                    <option value='1'>可用</option>
                </select>
            </td>
            <td></td>
        </tr>

    </table>

</form>
<ul id="tree"></ul>


